<%@ page language="java" import="java.util.*" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>   
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>    

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>个人中心</title>
<script type="text/javascript" src="js/jquery-1.12.3.min.js"></script>
<script type="text/javascript" src="js/ajaxfileupload.js"></script>
<link rel="stylesheet" href="css/person.css" />
<script type="text/javascript" src="js/custom/person.js"></script>
<script type="text/javascript">
	var memberId="${member.id}";
	$(function() {
		$("#memPortraitFile").change(function() {
			var $file = $(this);
			var fileObj = $file[0];
			var windowURL = window.URL || window.webkitURL;
			var dataURL;
			var $img = $("#picPreview");
			$("#picPreviewDiv").css("display","block");			
			if (fileObj && fileObj.files && fileObj.files[0]) {
				dataURL = windowURL
						.createObjectURL(fileObj.files[0]);
				$img.attr('src', dataURL);
			} else {
				dataURL = $file.val();
				var imgObj = document.getElementById("preview");
				imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
				imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;
			}
		});
	});
</script>
</head>
<body>
	<jsp:include page="frame.jsp"></jsp:include>
	<div class="personAllInfo">
		<jsp:include page="personInfoLeftPart.jsp"></jsp:include>
		<div class="personInfo">
			<div class="myInfo">
				<span>个人信息</span>
			</div>
			<div class="image">
				<span class="spanCommon">修改头像</span>
				<div class="myImage" align="center" style="float: left; margin-right: 15px; margin-bottom: 40px;">
					<img alt="" src="${member.portrait }" />
				</div>
				<div class="myImage" align="center" id="picPreviewDiv">
					<img alt="" src="" id="picPreview" />
				</div>
 				<span id="uploadMessage" style="color:red; position: relative; left:-165px; display:none;"></span>
				<form action="member_pushPortrait" method="post" enctype="multipart/form-data" style="clear:both;">
					<input type="hidden" name="member.id" value="${member.id }" />
					<input type="file" id="memPortraitFile" name="portrait" />
					<input type="submit" value="提交"/>
				</form>
			</div>
			<div class="infomation" style="clear: both;">
				<span class="spanCommon">修改信息</span>
				<form action="" method="post">
					<table>
						<tr>
							<td class="leftTd">手机号：</td>
							<td class="rightTd">
								<input type="text" name="" value="${member.phoneNumber }" />
							</td>
						</tr>
						<tr>
							<td class="leftTd">昵称：</td>
							<td class="rightTd"><input type="text" name="" value="${member.nickName }" /></td>
						</tr>						
						<tr>
							<td class="leftTd">性别：</td>
							<td class="rightTd">
								<input type="radio" name="sex" <c:if test="${'1' eq member.sex }">checked="checked"</c:if> /> 男&nbsp;&nbsp;
								<input type="radio" name="sex" <c:if test="${'2' eq member.sex }">checked="checked"</c:if> /> 女
							</td>
						</tr>
						<tr>
							<td class="leftTd">所在高校：</td>
							<td class="rightTd">
								<select name="member.province" id="s_province">
									<option value="${member.province }">${member.province }</option>
								</select>
								<select name="member.city" id="s_city">
									<option value="${member.city }">${member.city }</option>
								</select>
								<select name="member.school" id="s_school">
									<option value="${member.school }">${member.school }</option>
								</select>
							</td>
						</tr>
						<tr>
							<td class="leftTd"></td>
							<td class="rightTd"><input type="button" id="" value="修改信息" /></td>
						</tr>
					</table>
				</form>
			</div>
			<div class="infomation">
				<span class="spanCommon">修改密码</span>
				<form action="member_alterPassword" method="post" id="alterPswForm">
					<table>
						<tr>
							<td class="leftTd">原始密码：</td>
							<td class="rightTd">
								<input type="password" name="member.password" id="oldPassword" placeholder="请输入旧密码" />
								<span style="color: red; display:none;">&nbsp;&nbsp;&nbsp;&nbsp;请输入旧密码！</span>
								<span style="color: red; display:none;">&nbsp;&nbsp;&nbsp;&nbsp;原密码错误！</span>
							</td>
						</tr>
						<tr>
							<td class="leftTd">新密码：</td>
							<td class="rightTd">
								<input type="password" name="newPsw" id="newPassword" placeholder="请输入新密码" />
								<span style="color: red; display:none;">&nbsp;&nbsp;&nbsp;&nbsp;请输入新密码！</span>
							</td>
						</tr>						
						<tr>
							<td class="leftTd">确认密码：</td>
							<td class="rightTd">
								<input type="password" name="againPsw" id="passwordAgain" placeholder="请再次输入密码" />
								<span style="color: red; display:none;">&nbsp;&nbsp;&nbsp;&nbsp;请再次输入密码！</span>
								<span style="color: red; display:none;">&nbsp;&nbsp;&nbsp;&nbsp;两次输入的密码不一致</span>
							</td>
						</tr>
						<tr>
							<td class="leftTd"></td>
							<td class="rightTd"><input type="button" id="alterPwsBtn" value="确认修改" /></td>
						</tr>
					</table>
				</form>
			</div>
		</div>
	</div>
	<jsp:include page="foot.jsp"></jsp:include>
</body>
</html>